<template>

  <!--天气模块-->
  <div>
    <el-header class="layout-header">
      <h1>欢迎使用后台管理系统</h1>
    </el-header>
      <div style="width: 320px;height: 210px;background-image: linear-gradient(80deg, #19c2a5, #034d98);
};border-radius:15px;">
        <div v-if="this.$route.query.name !=null">
          <h2 style="margin: 0 0 0 10px">员工:</h2>
          <h1 style="font-size: 40px;margin: 10px 0 0 10px">{{ this.$route.query.name }}</h1>
          <i class="el-icon-user-solid" style="font-size: 120px"></i>
          <router-link to='/'>
            <el-button style="margin: -60px 15px 20px 170px;float: right"
                       type="primary" round>退出登录<i class="el-icon-back el-icon--right"></i>
            </el-button>
          </router-link>
        </div>
        <!--      @click="logout()-->
        <div v-else><!--没有登录时显示下面内容-->
          <a href="/login.html">登录</a>
        </div>
      </div>

      <div style="margin: 15px 0 0 0" class="info_weather">
        <div id="he-plugin-standard"></div>
      </div>


      <el-button style="width: 320px;height:210px;background-image: linear-gradient(80deg, #19c2a5, #034d98);" round @click="choseproduct">
        <div style="width: 320px;height: 210px;

        };border-radius:15px;float: right;margin: 0 600px 0 0">
        </div>
        商品列表</el-button>

    <div style="width: 320px;height: 210px;background-image: linear-gradient(80deg, #19c2a5, #034d98);
};border-radius:15px;float: right;margin: 0 50px 0 0">
      <h2>123123</h2>
    </div>
      <el-calendar
                   style="width: 320px;
                   height: 635px;
                   background-color: #ececec;
                   margin: 15px 0 0 0;
                   border-radius:15px;">
      </el-calendar>










  </div>
</template>

<script>
export default {
  return: {
    admin: [],
    value: new Date(),
  },
  mounted() {
    this.weathers();
  },
  methods: {
    choseproduct(){
      this.$router.push({path:'/other/temp/Product'})
    },
    logout() {
      axios.get("/logout").then(function (response) {
        //修改user的值  页面会跟着发生改变
        this.name = {};
      })
    },
    // 获取天气
    weathers() {
      // 到和风天气官网设计和下载 https://widget.qweather.com/
      window.WIDGET = {
        CONFIG: {
          layout: "1",
          width: "320",
          height: "210",
          background: "1",
          dataColor: "FFFFFF",
          borderRadius: "15",
          key: "9f5cb7d9725e483f95457d258eaba2cb",
        },
      };
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.src =
          "https://widget.qweather.net/standard/static/js/he-standard-common.js?v=2.0";
      document.getElementsByTagName("head")[0].appendChild(script);
    },// 获取天气结束
  }
}

</script>

<style scoped>
.layout-header { background-image: linear-gradient(80deg, #6699FF, #CCCCFF); text-align: center}
</style>